var steps = []
steps = $(".crewDrillStep");

$(".crew").find(".btn-step").remove();
var liHtml = "";
$(".crewDrill").each(function(index,element){
    if($(this).find(".crewDrillStep")){
        var html = `
        <div class="btn-step">
            <div class="back btn-group">
                <button type="button" class="layui-btn layui-btn-normal">上一步</button>
            </div>
            <div class="next btn-group">
                <button type="button" class="layui-btn layui-btn-normal">下一步</button>
            </div>
        </div>
        <div class="bottom-line"></div>`
        $(this).find(".crewDrillStep").append(html)
    }
    if(index==$(".crewDrill").length-1){
        $(this).find(".next button").text("结束");
    }
    if(index==0){
        liHtml += `<li class="layui-timeline-item2">
        <i class="layui-icon circle"></i>`+$(this).prop("outerHTML")+`</li>`;
    }else{

        liHtml += `<li class="layui-timeline-item2">
        <i class="layui-icon circle"></i>`+$(this).prop("outerHTML")+`</li>`;
    }
})
$(".operation").children(".crewDrill").remove();
var ulHtml = `<ul id="faultList" class="layui-timeline">`+liHtml+`</ul>`;
$(".operation").append(ulHtml);

//初始化--删除第一个过程类的上一步
$(".crewDrillStep:first").find(".btn-step .back").remove();

//初始化--样式修改
$(".crewDrillStep").each(function(index,element){
    $(this).parents().removeClass("hidden");
    $(this).removeClass("hidden");
    if(index>0){
        $(this).find(".para").css("color","#999999");
        $(this).find("button").css("border","1px solid #CCCCCC");
        $(this).find("button").attr("disabled","true");
        $(this).find("button").addClass("layui-disabled");
    }
})

/* 下一步 */
$(".next").on("click", function () {
    //判断第一个按钮
    if($(this).parent().find("button").length > 1){
        $(this).parent().find(".back").addClass("hidden");
        $(this).parent().parent().parent().parent().removeClass("layui-timeline-item3");
        $(this).parent().parent().parent().parent().addClass("layui-timeline-item");
    }else{
        $(this).parent().parent().parent().parent().removeClass("layui-timeline-item2");
        $(this).parent().parent().parent().parent().addClass("layui-timeline-item");
    }
    //修改当前样式
    $(this).find("button").text("已完成");
    $(this).find("button").attr("disabled","true");
    $(this).find("button").addClass("layui-disabled");
    $(this).find("button").addClass("buttonBgreen");
    $(this).find("button").css({"border":"1px solid #CCCCCC"});
    //修改NEXT样式
    var _this = $(this).parent().parent().parent().parent();
    if(_this.next()){
        if($.trim(_this.next().find(".next").text()) == "下一步" || $.trim(_this.next().find(".next").text()) == "结束"){
            _this.next().find(".para").css("color","#FFFFFF");
            _this.next().find(".hint-content .para").css("color","#000");
            _this.next().find("button").css({"border":"1px solid #186FF2","color":"#186FF2"});
            _this.next().find("button").removeAttr("disabled");
            _this.next().find("button").removeClass("layui-disabled");
            _this.next().removeClass("layui-timeline-item2");
            _this.next().addClass("layui-timeline-item3");
        }else{
            _this.next().find(".para").css("color","#FFFFFF");
            _this.next().find(".hint-content .para").css("color","#000");
            _this.next().find(".back button").css({"border":"1px solid #186FF2","color":"#186FF2"});
            _this.next().find(".back button").removeAttr("disabled");
            _this.next().find(".back button").removeClass("layui-disabled");
            _this.next().removeClass("layui-timeline-item2");
            _this.next().addClass("layui-timeline-item3");
        }
    }
    $("html,body").animate({scrollTop:$(".layui-timeline-item3").offset().top - $(window).height()/2 + 100 + "px"}, 500);
})
/* 上一步 */
$(".back").on("click", function () {
    $(this).parent().parent().find(".para").css("color","#999999");
    $(this).parent().parent().find("button").css({"border":"1px solid #CCCCCC","color":"# D2D2D2"});
    $(this).parent().parent().find("button").attr("disabled","true");
    $(this).parent().parent().find("button").addClass("layui-disabled");
    var _this = $(this).parent().parent().parent();
    if(_this.parent().hasClass("layui-timeline-item3")){
		_this.parent().removeClass("layui-timeline-item3");
		_this.parent().addClass("layui-timeline-item2");
	}
    if(_this.parent().prev()){
        _this.parent().prev().find("button").text("下一步");
        _this.parent().prev().find(".para").css("color","#FFFFFF");
        _this.parent().prev().find(".next button").css({"border":"1px solid #186FF2","color":"#186FF2",});
        _this.parent().prev().find(".next button").removeAttr("disabled");
        _this.parent().prev().find(".next button").removeClass("layui-disabled");
        _this.parent().prev().find(".next button").removeClass("buttonBgreen");
        if(_this.parent().prev().hasClass("layui-timeline-item")){
            _this.parent().prev().removeClass("layui-timeline-item");
            _this.parent().prev().addClass("layui-timeline-item3");
        }
        //判断不是第一个按钮
        if(_this.parent().prev().find("button").length > 1){
            _this.parent().prev().find(".back").removeClass("hidden");
            _this.parent().prev().find(".back button").text("上一步");
        }else{
            _this.parent().prev().removeClass("layui-timeline-item3");
            _this.parent().prev().addClass("layui-timeline-item2");
        }
    }
    $("html,body").animate({scrollTop:$(".layui-timeline-item3").offset().top - $(window).height()/2 + 100 + "px"}, 500);
})

/* 修改操作描述类中序号和描述不兼容 */
if ($(".descrCrew").length > 0) {
    $(".title").css("display", "inline");
    $(".btn-step").css("display", "none");
}
